Як додати ШI-чатбот Asyntai до Backdrop CMS

Покрокова інструкція для сайтів Backdrop CMS

Платформа:

Крок 1: Отримайте код для вставки

Спочатку перейдiть до вашої Панелi керування Asyntai та прокрутiть вниз до роздiлу "Код для вставки". Скопiюйте унiкальний код для вставки, який виглядатиме так:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Примітка: Код вище є лише прикладом. Ви повиннi скопiювати власний унiкальний код для вставки з вашої Панелi керування, оскiльки вiн мiстить ваш особистий ID вiджета.

Крок 2: Додайте до шаблону теми (Рекомендовано)

Backdrop CMS використовує файли шаблонiв .tpl.php у своїх темах. Рекомендований пiдхiд - додати код для вставки безпосередньо до шаблону сторiнки вашої активної теми:

Отримайте доступ до вашої установки Backdrop CMS через FTP або Файловий менеджер
Перейдiть до каталогу вашої активної теми: themes/yourtheme/
Вiдкрийте файл page.tpl.php (або layout.tpl.php залежно вiд вашої теми)
Знайдiть закриваючий тег </body> або рядок <?php print $page_bottom; ?>
Вставте ваш код для вставки Asyntai безпосередньо перед цим рядком
Збережіть файл

<!-- Asyntai AI Chatbot -->
<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
<?php print $page_bottom; ?>
</body>

Порада: Розмiщення коду безпосередньо перед <?php print $page_bottom; ?> або закриваючим тегом </body> забезпечує завантаження чатбота пiсля вмiсту сторiнки, що покращує продуктивнiсть завантаження. Цей метод автоматично додає чатбот на кожну сторiнку, що використовує цю тему.

Альтернативний метод 1: Використання користувацького модуля

Ви можете створити простий модуль Backdrop CMS, який вставляє скрипт чатбота за допомогою backdrop_add_js():

Створіть каталог модуля: modules/custom/asyntai_widget/
Створiть файл модуля asyntai_widget.module з наступним кодом:
// modules/custom/asyntai_widget/asyntai_widget.module function asyntai_widget_init() { backdrop_add_js('https://asyntai.com/static/js/chat-widget.js', array( 'type' => 'external', 'scope' => 'footer', 'attributes' => array('async' => 'async', 'data-asyntai-id' => 'YOUR_WIDGET_ID'), )); }
Створіть файл asyntai_widget.info:
name = Asyntai AI Chatbot Widget description = Adds the Asyntai AI chatbot widget to all pages. backdrop = 1.x package = Custom type = module
Перейдiть до Функцiональнiсть (admin/modules) у панелi адмiнiстрування Backdrop
Знайдiть "Asyntai AI Chatbot Widget" у пакетi Custom та увiмкнiть його
Натисніть "Save configuration"

Примітка: Замiнiть YOUR_WIDGET_ID у кодi модуля на ваш фактичний ID вiджета з Панелi керування Asyntai. Пiдхiд з користувацьким модулем безпечний для оновлень i не буде перезаписаний при оновленнi теми.

Альтернативний метод 2: Використання модуля "Add to Head" Backdrop

Допомiжний модуль "Add to Head" надає простий спосiб вставки скриптiв без редагування коду:

Завантажте та встановiть допомiжний модуль "Add to Head" з сайту Backdrop CMS
Перейдіть до Configuration > Development > Add to Head
Додайте ваш код вбудовування Asyntai у footer section
Натисніть "Save configuration"

Порада: Використання модуля "Add to Head" є найпростiшим методом, якщо ви не хочете редагувати файли теми або створювати користувацькi модулi. Вiн надає простий адмiнiстративний iнтерфейс для управлiння вставленими скриптами.

Альтернативний метод 3: Використання системи блоків

Система макетiв та блокiв Backdrop CMS також може використовуватися для додавання чатбота:

Увійдіть до вашої панелі адміністрування Backdrop CMS
Перейдіть до Structure > Layouts
Оберіть макет, який хочете редагувати (наприклад, макет за замовчуванням)
Натиснiть "Add block" в областi нижнього колонтитула
Оберіть "Custom block"
Встановiть формат блоку на "Full HTML" або "Raw HTML"
Вставте ваш код для вставки Asyntai в тіло блоку
Дайте блоку назву (наприклад, "Asyntai Chatbot") та за бажанням поставте прапорець "Hide title"
Натиснiть "Save block", а потiм "Save layout"

Важливо: Переконайтеся, що текстовий формат встановлено на "Full HTML" або "Raw HTML", щоб тег скрипту не був видалений. Формат "Filtered HTML" за замовчуванням видалить теги скриптiв з мiркувань безпеки.

Крок 3: Очистіть кеш та перевірте

Після внесення змін очистіть кеш Backdrop CMS та перевірте встановлення:

Перейдiть до Configuration > Performance у вашiй панелi адмiнiстрування
Натисніть "Clear all caches"
Відкрийте ваш сайт у новій вкладці браузера або вікні інкогніто
Ви повинні побачити кнопку віджета чату в правому нижньому куті
Натисніть на нього, щоб переконатися, що він відкривається та працює коректно

Не бачите віджет? Переконайтеся, що ви очистили кеш Backdrop CMS у Configuration > Performance. Спробуйте переглянути сайт у вiкнi iнкогнiто або очистити кеш браузера. Вiдкрийте консоль браузера (F12), щоб перевiрити наявнiсть помилок JavaScript. Якщо ви використовували метод користувацького модуля, переконайтеся, що модуль увiмкнено в Функцiональнiсть.